<template>
    <div class="empty">
         <div class="empty-box">
            <div class="empty-box-img">
                <img src="@/assets/images/empty.png" alt="">
            </div>
            <div class="empty-box-text">
                <div class="empty-box-text-title">{{ emptyText ? emptyText : '暂无数据~' }}</div>
            </div>
         </div>
    </div>
</template>
<script>
    export default {
        name: 'empty',
        props: {
            emptyText: String
        },
    }
</script>
<style lang="less" scoped>
 .empty{
    padding: 100px 0;
    .empty-box{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        .empty-box-img{
            width: 190px;
            height: 190px;
            img{
                width: 100%;
                height: 100%;
            }
        }
        .empty-box-text{
            margin-top: 20px;
            .empty-box-text-title{   
                font-size: 16px;
                color: #333;
                margin-top: 10px;
                text-align: center;
                font-weight: 500;
                line-height: 20px;
                word-break: break-all;
                white-space: normal;
            }
        }
    }
 }
</style>